<template>
  <template v-if="user">
    <div v-if="user" style="text-align: center;">
      <van-image
          round
          width="8rem"
          height="8rem"
          :src="user.avatarUrl"
          style="margin-top: 20px; margin-bottom: 20px; box-shadow: 0 0 15px rgba(0, 0, 0, 0.4)"
      />
    </div>
    <van-cell title="当前用户" :value="user?.username" />
    <van-cell title="修改信息" is-link to="/user/update" />
    <van-cell title="我创建的队伍" is-link to="/user/team/create" />
    <van-cell title="我加入的队伍" is-link to="/user/team/join" />
  </template>
  <div style="margin: 16px;">
    <van-button round block type="primary" @click="logout">
      退出登录
    </van-button>
  </div>
</template>

<script setup lang="ts">
import {useRouter} from "vue-router";
import {onMounted, ref} from "vue";
import {getCurrentUser} from "../../services/user";
import myAxios from "../../plugins/myAxios";
import {Toast} from "@vant/compat";

const user = ref();
const route=useRouter();

onMounted(async ()=>{
  user.value=await getCurrentUser();
})

const router = useRouter();
const logout = async () => {
  const res = await myAxios.post("/user/logout");
  if (res.code == 0 && res.data != null) {
    Toast.success("退出成功");
    await router.replace("/user/login")
  } else {
    Toast.fail("退出失败");
  }
};

</script>

<style scoped>

</style>